<template>
  <!-- App -->
  <div id="app">
    <div class="statusbar-overlay "></div>
    <div class="views tabs toolbar-through tabbar-through">

      <!-- 登录页-->
      <div class="login-screen modal-in" v-if="isLogin==true">
        <f7-view id="view-login">
          <f7-pages navbar-through>
            <mzLogin></mzLogin>
          </f7-pages>
        </f7-view>
      </div>

      <!-- 管理-->
      <f7-view id="managerView" main tab active >
        <f7-pages navbar-through>
          <manager></manager>
        </f7-pages>
      </f7-view>

      <!-- 报表-->
      <f7-view id="graphView" tab>
        <f7-pages navbar-through>
          <graph></graph>
        </f7-pages>
      </f7-view>

      <!-- 消息-->
      <f7-view id="messageView" tab>
        <f7-pages navbar-through>
          <message></message>
        </f7-pages>
      </f7-view>

      <!-- 我-->
      <f7-view id="userView" tab>
        <f7-pages navbar-through>
          <user></user>
        </f7-pages>
      </f7-view>

      <!-- Bottom Toolbar-->
      <div class="toolbar tabbar  tabbar-labels">
        <div class="toolbar-inner">
          <a href="#managerView" class="tab-link active"><i class="icon f7-icons c-icon-tape">home_fill</i><span class="tabbar-label">管理</span></a>
          <a href="#graphView"  class="tab-link"><i class="icon f7-icons c-icon-list">list</i><span class="tabbar-label">报表</span></a>
          <a href="#messageView" class="tab-link"><i class="icon f7-icons c-icon-chat">chats<span class="badge bg-red">5</span></i><span class="tabbar-label">消息</span></a>
          <a href="#userView" class="tab-link"><i class="icon f7-icons c-icon-person">person_fill</i><span class="tabbar-label">我</span></a>
        </div>
      </div>
    </div>
  </div>
</template>

<style>
  .views{overflow: hidden}
</style>

<script>
    import mzLogin from './pages/login/govLogin.vue'
    import manager from './pages/manager/index.vue'
    import graph from './pages/graph/index.vue'
    import message from './pages/message/index.vue'
    import user from './pages/user/index.vue'
    import helper from '../src/common/helper'

//    window.manager = manager;
    export default {
        data(){
            return{
                isLogin:true
            }
        },
        components:{
            mzLogin,
            manager,
            graph,
            message,
            user
        },
        created(){
            this.isEffectiveLogin();
        },
        methods:{
            isEffectiveLogin(){
                let loginState = helper.localStorage('loginState');
                if (loginState === undefined || loginState === "fail" || loginState === null){
                    this.isLogin = true;
                } else{
                    this.isLogin = false;
                }
            }
        }
    }
</script>